<%--
  Created by IntelliJ IDEA.
  User: 13371
  Date: 2021/7/24
  Time: 16:52
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>$Title$</title>
    <script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
    <script type="text/javascript">
        $(() => {
            $("#name1").blur(() => {
                //1.获得value值
                var name = $("#name1").val();
                $.ajax({
                    url: "/a",
                    method: "post",
                    data: "name=" + name,
                    type: "post",
                    dataType: "text",
                    success: (res) => {
                        console.log(res);
                        $("#tip1").html(res);
                    }
                });
            });

            $("#uuid").blur(() => {
                //1.获得value值
                var uuid = $("#uuid").val();
                $.ajax({
                    url: "/b",
                    method: "post",
                    data: "uuid=" + uuid,
                    success: (rs) => {
                        console.log(rs);
                        //转换成可以处理的js
                        rs = eval("(" + rs + ")");
                        //此时的rs是json格式的对象
                        $("#name").val(rs.name);
                        $("#password").val(rs.password);
                        $("#age").val(rs.age);
                    }
                })
            });
        });
    </script>
</head>
<body>
<h1>AJAX 实现用户名有效性验证</h1>
name:<input type="text" id="name1" name="name"/> <span id="tip1"></span> <br>

<h1>AJAX 实现用户数据的自动填充</h1>
uuid:<input type="text" id="uuid"><br>
name:<input type="text" id="name"><br>
password:<input type="text" id="password"><br>
age:<input type="text" id="age">
</body>
</html>
